//公共类基库

//重置盒子模型
* {
  @include box-sizing(border-box);

  &:before, &:after {
    @include box-sizing(border-box);
  }
}

//设置根字体大小
html {
  font-size: $font-size-base;
}

body {
  font-family: $font-family-base;
  font-size: 1.4rem;
  line-height: $line-height-base;
  color: $text-color-base;
  background-color: $body-color;
}

//浮动与清除浮动
.fn-left {
  float: left;
}

.fn-right {
  float: right;
}

.fn-clear {
  @include clearfix();
}

.overflow-hide {
  overflow: hidden;
}

//外边框
.ma-a {
  margin: $margin-base !important;
}

.ma-t {
  margin-top: $margin-base !important;
}

.ma-r {
  margin-right: $margin-base !important;
}

.ma-b {
  margin-bottom: $margin-base !important;
}

.ma-l {
  margin-left: $margin-base !important;
}

//清除外边框
.nma-a {
  margin: 0 !important;
}

.nma-t {
  margin-top: 0 !important;
}

.nma-r {
  margin-right: 0 !important;
}

.nma-b {
  margin-bottom: 0 !important;
}

.nma-l {
  margin-left: 0 !important;
}

//内边距
.pa-a {
  padding: $padding-base !important;
}

.pa-t {
  padding-top: $padding-base !important;
}

.pa-r {
  padding-right: $padding-base !important;
}

.pa-b {
  padding-bottom: $padding-base !important;
}

.pa-l {
  padding-left: $padding-base !important;
}

//清除内边距
.npa-a {
  padding: 0 !important;
}

.npa-t {
  padding-top: 0 !important;
}

.npa-r {
  padding-right: 0 !important;
}

.npa-b {
  padding-bottom: 0 !important;
}

.npa-l {
  padding-left: 0 !important;
}

//文本对齐
.ta-c {
  text-align: center !important;
}

.ta-l {
  text-align: left !important;
}

.ta-r {
  text-align: right !important;
}

.ta-j {
  text-align: justify
}

//字体颜色
.tc-base {
  color: $text-color-base !important;
}

.tc-gray-base {
  color: $gray-base !important;
}

.tc-black {
  color: #000000 !important;
}

.tc-white {
  color: #ffffff !important;
}

.tc-gray-darker {
  color: $gray-darker !important;
}

.tc-gray-dark {
  color: $gray-dark !important;
}

.tc-gray {
  color: $gray !important;
}

.tc-gray-light {
  color: $gray-light !important;
}

.tc-gray-lighter {
  color: $gray-lighter !important;
}

.tc-main {
  color: $main-color !important;
}

.tc-second {
  color: $second-color !important;
}

//背景颜色
.bc-base {
  background-color: $text-color-base !important;
}

.bc-gray-base {
  background-color: $gray-base !important;
}

.bc-black {
  background-color: #000000 !important;
}

.bc-white {
  background-color: #ffffff !important;
}

.bc-gray-darker {
  background-color: $gray-darker !important;
}

.bc-gray-dark {
  background-color: $gray-dark !important;
}

.bc-gray {
  background-color: $gray !important;
}

.bc-gray-light {
  background-color: $gray-light !important;
}

.bc-gray-lighter {
  background-color: $gray-lighter !important;
}

.bc-main {
  background-color: $main-color !important;
}

.bc-second {
  background-color: $second-color !important;
}
